/**
 * Created by Jason on 2017/7/16.
 */
/*
 用户数据基本结构定义
 user_id,
 nike_name,
 avatar,
 level,
 type,
 from,
 content,
 action,
 time,
 room_id,

 */
window.w = {
    room_id: null,
    user_id: null,
    nick_name: null,
    avatar: null,
    level: null,
    type: null,
    from: null,
    socket: null,
    messageContainer: document.getElementById('msg-list'),
    scrollToBottom: function () {
        var scrollHeight = document.querySelector('.msg-list').scrollHeight - document.querySelector('.container').scrollHeight
            + document.querySelector('.ctrl').scrollHeight;
        this.messageContainer.scrollTop = scrollHeight;
    },
    init: function (room_id, user_id, nick_name, avatar, level, type, from) {
        this.socket = io.connect('ws://localhost:8000');
        this.room_id = room_id;
        this.user_id = user_id;
        this.nick_name = nick_name;
        this.avatar = avatar;
        this.level = level;
        this.type = type;
        this.from = from;

        obj = {
            room_id:room_id,
            user_id: user_id,
            nick_name: nick_name,
            avatar: avatar,
            level: level,
            type: type,
            from: from,
        };
        //登录
        this.socket.emit('login', obj);

        //监听登录
        this.socket.on('login', function (obj) {
            w.updateMessage(obj, 'login');
        });

        //监听收到消息
        this.socket.on('message', function (obj) {
            w.updateMessage(obj, 'message');
        });

        //监听退出信息
        this.socket.on('logout', function (obj) {
            w.updateMessage(obj, 'logout');
        })

    },
    updateMessage: function (obj, action) {
        console.info(obj);
        /*
         <section class="system">
         <div class="msg-system">印度阿三进来了333</div>
         </section>
         <section class="receive">
         <span>阿三</span>
         <div>吃早饭了吗?</div>
         </section>
         <section class="receive-me">
         <span>Jason</span>
         <div>还没有呢</div>
         </section>
         */
        var html = '';
        if (action == 'login' || action == 'logout') {
            html = '<section class="system">'
                + '<div class="msg-system">' + obj.nick_name
                + (action == 'login' ? ' 进来了' : ' 离开了') + '</div>'
                + '</section>';
        }
        if (action == 'message') {
            if (obj.user_id == this.user_id) {
                html = '  <section class="receive-me">'
                    + '<span>' + obj.nick_name + '</span>'
                    + '<div>' + obj.content + '</div>'
                    + '</section>';
            } else {
                html = '  <section class="receive">'
                    + '<span>' + obj.nick_name + '</span>'
                    + '<div>' + obj.content + '</div>'
                    + '</section>';
            }
        }
        $('#msg-list').append(html);
        w.scrollToBottom();
    },
    sendMessage: function (content,type) {
        if (content == '') {
            return;
        }
        var obj = {
            user_id: this.user_id,
            content: content,
            type:type,
        };
        this.socket.emit('message', obj);
    }
};